<script setup lang="ts">
import {
    appFlowFileLogFind
} from '@/api/app';
import { VITE_APP_IMAGE_BASE_URL as baseImage } from '@/utils/base';
import { formatMillisecondsToDate, aDownloadFile } from '@/utils/utils'
import { clearFormData } from '@/utils/utils';

const props = defineProps({
    dialog: {
        required: true,
        type: Object,
        default: {}
    },
    formData: {
        required: true,
        type: Object,
        default: {}
    },
})

const { dialog, formData } = props

const dataFormRef = ref(ElForm);

const total = ref(0);
const dataList: any = ref([])

const queryParams: any = reactive({
    current: 1,
    pageSize: 9999,
    beginTime: '',
    endTime: '',
});

/**
 * 关闭弹窗
 */
function closeDialog() {
    dialog.visible = false;
    resetForm();
}

/**
 * 重置表单
 */
function resetForm() {
    clearFormData(formData);
    formData.status = 1
}


/**
 * 确定
 */
function handleSubmit() {
    // appScreenLogDetailsExport(queryParams)
    //     .then((res: any) => {
    //         aDownloadFile({ url: res.data });
    //         ElMessage.success('操作成功！');
    //     })
}

/**
 * 查询
 */
function handleQuery() {
    appFlowFileLogFind(queryParams)
        .then((res: any) => {
            dataList.value = res.data.data;
            total.value = res.data.total;

        })
}

watch(() => dialog.visible, (val) => {
    if (val) {
        console.log(formData)
        queryParams.ids = formData.childIds || []

        handleQuery()
    }
})

onMounted(() => {

});
</script>

<template>
    <div>
        <!--线路绑定-->
        <el-dialog :title="dialog.title" v-model="dialog.visible" width="1000px" @close="closeDialog">
            <div>

                <el-table :data="dataList" :show-header="false">
                    <el-table-column label="动作类型" align="center" prop="object" />
                    <el-table-column label="执行动作" align="left">
                        <template #default="scope">
                            执行动作：{{ scope.row.action }}
                        </template>
                    </el-table-column>
                    <el-table-column label="具体操作" align="center" prop="type" />
                    <el-table-column label="结果" align="left" width="120">
                        <template #default="scope">
                            <el-tag v-if="scope.row.result === '执行完成'" type="success">执行完成</el-tag>
                            <el-tag v-else="scope.row.result === '执行异常'" type="danger">执行异常</el-tag>
                        </template>
                    </el-table-column>
                    <el-table-column label="操作时间" align="center" width="200">
                        <template #default="scope">
                            {{ formatMillisecondsToDate(scope.row.createdAt) }}
                        </template>
                    </el-table-column>
                </el-table>

            </div>
            <template #footer>
                <div class="dialog-footer">
                    <el-button @click="closeDialog">取 消</el-button>
                </div>
            </template>
        </el-dialog>
    </div>
</template>

<style scoped>
.a-class {
    color: dodgerblue;
    margin-left: 10px;
}

.upload-demo .upload-demo-img {
    width: 100px;
    height: 100px;
    display: block;
}

:deep(.el-upload-list) {
    display: none !important;
}
</style>

<style>
.upload-demo .el-upload {
    border: 1px dashed var(--el-border-color);
    border-radius: 6px;
    cursor: pointer;
    position: relative;
    overflow: hidden;
    transition: var(--el-transition-duration-fast);
}

.upload-demo .el-upload:hover {
    border-color: var(--el-color-primary);
}

.el-icon.upload-demo-icon {
    font-size: 28px;
    color: #8c939d;
    width: 100px;
    height: 100px;
    text-align: center;
}
</style>